
// .vitepress/config.mts
import { defineConfig } from "vitepress";
import { defineTeekConfig } from "vitepress-theme-teek/config";
// import { vitepressPluginLegend } from 'vitepress-plugin-legend';
// Teek 主题配置
const teekConfig = defineTeekConfig({
  logo: {
    src: '/logo3.svg',
    width: 40,
    height: 40
  },

  // 导航栏配置
  nav: [
    { text: '首页', link: '/' },
    {
      text: '前端基础',
      items: [
        // { text: 'HTML视频教程笔记', link: '/videonote/html' },
        // { text: 'HTML基础课', link: '/html/' },
        { text: 'HTML标准文档导读', link: '/html-Living/' },
        { text: 'CSS系统课', link: '/css/' },
        { text: '响应式设计', link: '/responsive-web/' },
        { text: 'JavaScript基础课', link: '/js/' },
        { text: '《ECMAScript 6入门》', link: 'https://es6.ruanyifeng.com/' },
        { text: '《现代 JavaScript 教程》', link: 'https://zh.javascript.info/' },
        { text: '性能优化基础', link: '/performance/' },
        { text: 'web.dev性能课程', link: 'https://web.dev/learn/performance' }
      ]
    },
    { text: 'Node.js', link: '/nodejs/' },
    {
      text: 'TypeScript', items: [
        { text: '深入理解 TypeScript', link: 'https://jkchao.github.io/typescript-book-chinese/' },
      ]
    },


    {
      text: '前端工程化',
      items: [
        { text: '带你入门前端工程', link: 'https://woai3c.github.io/introduction-to-front-end-engineering/' }
      ]
    },

    { text: 'Vue', link: 'https://cn.vuejs.org/' },
    {
      text: '算法',
      items: [
        { text: 'js数据结构与算法📺', link: 'https://www.bilibili.com/video/BV1x7411L7Q7/?vd_source=eb9bba208f30345eb6b86e5a045ccece' },
      ]
    },
    { text: '更多免费资源', link: '/free-resources/' }
  ],

  // 侧边栏配置
  sidebar: {
    // Node.js 部分的侧边栏
    '/nodejs/': [
      {
        text: 'Node.js 核心知识',
        items: [
          { text: '索引页', link: '/nodejs/index' },
          { text: 'Node.js 简介', link: '/nodejs/p1' },
          { text: '如何使用 Node.js REPL', link: '/nodejs/p2' },
          { text: '使用 exports 从 Node.js 文件暴露功能', link: '/nodejs/p3' },
          { text: 'package-lock.json 文件与 npm 包管理', link: '/nodejs/p4' },
          { text: 'JavaScript 事件循环与异步编程', link: '/nodejs/p5' },
          { text: 'Promises', link: '/nodejs/p6' },
          { text: '构建 HTTP 服务器', link: '/nodejs/p7' },
          { text: 'WebSockets 实时示例', link: '/nodejs/p8' },
          { text: 'Node.js fs 模块', link: '/nodejs/p9' },
          { text: 'Node.js 流', link: '/nodejs/p10' }
        ]
      }
    ],
    // HTML 部分的侧边栏
    '/html/': [
      {
        text: 'HTML基础课',
        items: [
          { text: '索引页', link: '/html/index' },
          { text: 'HTML概述', link: '/html/html概述' },
          { text: '文档结构', link: '/html/文档结构' },
          { text: '元数据', link: '/html/元数据' },
          { text: '语义化HTML ', link: '/html/语义化html' },
          { text: '标题和章节 ', link: '/html/标题和章节' },
          { text: '属性 ', link: '/html/属性' },
          { text: '文本基础', link: '/html/文本基础' },
          { text: '链接', link: '/html/链接' },
          { text: '列表', link: '/html/列表' },
          { text: '导航', link: '/html/导航' },
          { text: '表格', link: '/html/表格' },
          { text: '表单', link: '/html/表单' },
          { text: '图像', link: '/html/图像' },
          { text: 'web图像知识', link: '/html/web图像知识' },
          { text: '音频和视频', link: '/html/音频和视频' },
          { text: '模板、插槽和ShadowDOM', link: '/html/模板插槽和ShadowDOM' },
          { text: 'HTML API', link: '/html/html-api' },
          { text: '焦点', link: '/html/焦点' },
          { text: '其他内联文本元素', link: '/html/其他内联文本元素' },
          { text: '详情和摘要', link: '/html/详情和摘要' },
          { text: '对话框', link: '/html/对话框' },
          // { text: '结论和后续步骤', link: '/html/结论和后续步骤' }
        ]
      }
    ],

    // CSS 部分的侧边栏
    '/css/': [
      {
        text: 'CSS系统课',
        items: [
          {text:'css属性值计算过程.md',link:'/css/css属性值计算过程.md'},
          { text: 'CSS概述', link: '/css/index' },
          { text: '盒模型', link: '/css/盒模型' },
          { text: '选择器', link: '/css/选择器' },
          { text: '嵌套选择器', link: '/css/嵌套选择器' },
          { text: '级联', link: '/css/级联' },
          { text: '特异性', link: '/css/特异性' },
          { text: '继承', link: '/css/继承' },
          { text: '颜色', link: '/css/颜色' },
          { text: '尺寸单位', link: '/css/尺寸单位' },
          { text: '布局', link: '/css/布局' },
          { text: 'Flexbox', link: '/css/Flexbox' },
          { text: 'Grid', link: '/css/Grid' },
          { text: '逻辑属性', link: '/css/逻辑属性' },
          { text: '间距', link: '/css/间距' },
          { text: '伪元素', link: '/css/伪元素' },
          { text: '伪类', link: '/css/伪类' },
          { text: '边框', link: '/css/边框' },
          { text: '阴影', link: '/css/阴影' },
          { text: '聚焦', link: '/css/聚焦' },
          { text: 'z-index', link: '/css/z-index' },
          { text: '函数', link: '/css/函数' },
          { text: '渐变', link: '/css/渐变' },
          { text: '动画', link: '/css/动画' },
          { text: '滤镜', link: '/css/滤镜' },
          { text: '混合模式', link: '/css/混合模式' },
          { text: '列表', link: '/css/列表' },
          { text: '过渡', link: '/css/过渡' },
          { text: '溢出', link: '/css/溢出' },
          { text: '背景', link: '/css/背景' },
          { text: '文本与排版', link: '/css/文本与排版' },
          { text: '结论与下一步', link: '/css/结论与下一步' }
        ]
      }
    ],

    // HTML Living Standard 部分的侧边栏
    '/html-Living/': [
      {
        text: 'HTML Standard 文档导读',
        items: [
          { text: '目录总览', link: '/html-Living/' },
          { text: '1 Introduction（简介）', link: '/html-Living/1-Introduction' },
          { text: '2 Common infrastructure（常见基础设施）', link: '/html-Living/2-Common-infrastructure' },
          { text: '3 Semantics, structure, and APIs', link: '/html-Living/3-Semantics-structure-and-APIs' },
          { text: '4 The elements of HTML', link: '/html-Living/4-The-elements-of-HTML' },
          { text: '5 Microdata（微数据）', link: '/html-Living/5-Microdata' },
          { text: '6 User interaction（用户交互）', link: '/html-Living/6-User-interaction' },
          { text: '7 Loading web pages（加载网页）', link: '/html-Living/7-Loading-web-pages' },
          { text: '8 Web application APIs', link: '/html-Living/8-Web-application-APIs' },
          { text: '9 Communication（通信）', link: '/html-Living/9-Communication' },
          { text: '10 Web workers（Web工作者）', link: '/html-Living/10-Web-workers' },
          { text: '11 Worklets（工作单元）', link: '/html-Living/11-Worklets' },
          { text: '12 Web storage（Web存储）', link: '/html-Living/12-Web-storage' },
          { text: '13 The HTML syntax（HTML语法）', link: '/html-Living/13-The-HTML-syntax' },
          { text: '14 The XML syntax（XML语法）', link: '/html-Living/14-The-XML-syntax' },
          { text: '15 Rendering（渲染）', link: '/html-Living/15-Rendering' },
          { text: '16 Obsolete features（已废弃的特性）', link: '/html-Living/16-Obsolete-features' },
          { text: '17 IANA considerations', link: '/html-Living/17-IANA-considerations' }
        ]
      }
    ],

    // 响应式设计部分的侧边栏
    '/responsive-web/': [
      {
        text: '响应式设计',
        items: [
          { text: '欢迎学习响应式设计', link: '/responsive-web/' },
          { text: '媒体查询', link: '/responsive-web/media-queries' },
          { text: '国际化', link: '/responsive-web/internationalization' },
          { text: '宏观布局', link: '/responsive-web/macro-layouts' },
          { text: '微观布局', link: '/responsive-web/micro-layouts' },
          { text: '排版', link: '/responsive-web/typography' },
          { text: '响应式图像', link: '/responsive-web/responsive-images' },
          { text: 'Picture元素', link: '/responsive-web/picture-element' },
          { text: '图标', link: '/responsive-web/icons' },
          { text: '主题化', link: '/responsive-web/theming' },
          { text: '无障碍设计', link: '/responsive-web/accessibility' },
          { text: '交互设计', link: '/responsive-web/interaction' },
          { text: '用户界面模式', link: '/responsive-web/user-interface-patterns' },
          { text: '媒体特性', link: '/responsive-web/media-features' },
          { text: '屏幕配置', link: '/responsive-web/screen-configurations' },
          { text: '结论与下一步', link: '/responsive-web/conclusion-and-next-steps' }
        ]
      }
    ],

    // 性能优化部分的侧边栏
    '/performance/': [
      {
        text: '性能优化专题',
        items: [
          { text: '性能优化指南', link: '/performance/' },
          { text: '为什么速度很重要', link: '/performance/why-speed-matters' },
          { text: 'HTML性能优化', link: '/performance/html-optimization' },
          { text: '关键渲染路径', link: '/performance/critical-path' },
          { text: '资源加载优化', link: '/performance/resource-loading' },
          { text: '资源提示(Resource Hints)', link: '/performance/resource-hints' },
          { text: '图像性能优化', link: '/performance/image-optimization' },
          { text: '视频性能优化', link: '/performance/video-optimization' },
          { text: 'Web字体优化', link: '/performance/web-fonts' },
          { text: 'JavaScript代码分割', link: '/performance/code-splitting' },
          { text: '图片和iframe懒加载', link: '/performance/lazy-loading' },
          { text: '预加载与预渲染', link: '/performance/prefetch-prerender' },
          { text: 'Web Workers概述', link: '/performance/web-workers' },
          { text: 'Web Workers实战案例', link: '/performance/web-workers-demo' }
        ]
      }
    ],

    // JavaScript 部分的侧边栏
    '/js/': [
      {
        text: 'JavaScript入门课程',
        items: [
          { text: 'JavaScript入门课程', link: '/js/' },
          { text: 'JavaScript简介', link: '/js/introduction' },
          { text: '数据类型和结构', link: '/js/data-types' },
          { text: '数字', link: '/js/numbers' },
          { text: '字符串', link: '/js/strings' },
          { text: '布尔值', link: '/js/booleans' },
          { text: 'Null和Undefined', link: '/js/null-undefined' },
          { text: 'BigInt', link: '/js/bigint' },
          { text: 'Symbols', link: '/js/symbols' },
          { text: '变量', link: '/js/variables' },
          { text: '比较运算符', link: '/js/comparison-operators' },
          { text: '控制流程', link: '/js/control-flow' },
          { text: '函数基础', link: '/js/functions' },
          { text: '函数表达式', link: '/js/function-expressions' },
          { text: 'new关键字', link: '/js/new-keyword' },
          { text: 'return关键字', link: '/js/return-keyword' },
          { text: 'this关键字', link: '/js/this-keyword' },
          { text: '对象基础', link: '/js/objects' },
          { text: '属性访问器', link: '/js/property-accessors' },
          { text: '原型继承', link: '/js/prototypal-inheritance' },
          { text: '属性描述符', link: '/js/property-descriptors' },
          { text: '索引集合', link: '/js/indexed-collections' },
          { text: '键值集合', link: '/js/keyed-collections' },
          { text: '类基础', link: '/js/classes' },
          { text: '类继承', link: '/js/class-inheritance' },
          { text: '类字段和方法', link: '/js/class-fields-methods' },
          { text: '静态初始化块', link: '/js/static-blocks' },
          { text: '附录', link: '/js/appendix' }
        ]
      }
    ],
    '/free-resources/':[
      {
        text: '前端开发免费资源大全 ',
        link: '/free-resources/'
      }
    ]
  },
  loading: "吃奶哩劲都使出来了...",
  teekTheme: true,
  teekHome: false,
  vpHome: true,
  anchorScroll: true,
  sidebarTrigger: true,
  // homeCardSort: [],
  topArticle: {
    enabled: false,
  },
  category: {
    enabled: false
  },
  tag: {
    enabled: false
  },
  page: {
    disabled: true
  },
  post: {

  },
  docAnalysis: {
    enabled: false
  },
  windowTransition: true,
  blogger: {
    name: "无名氏", // 博主昵称
    slogan: "朝圣的使徒，正在走向编程的至高殿堂！", // 博主签名
    avatar: "https://testingcf.jsdelivr.net/gh/Kele-Bingtang/static/user/avatar1.png", // 博主头像
    shape: "circle-rotate", // 头像风格：square 为方形头像，circle 为圆形头像，circle-rotate 可支持鼠标悬停旋转，circle-rotate-last 将会持续旋转 59s
    circleBgImg: "/blog/bg4.webp", // 背景图片
    circleBgMask: true, // 遮罩层是否显示，仅当 shape 为 circle 且 circleBgImg 配置时有效
    circleSize: 100, // 头像大小
    color: "#333", // 字体颜色
    // 状态，仅当 shape 为 circle 相关值时有效
    status: {
      icon: "😪", // 状态图标
      size: 24, // 图标大小
      title: "困", // 鼠标悬停图标的提示语
    },
  },

  banner: {
    enabled: false,
  },
  author: {
    name: "丁同亚", // 作者名称
    link: "https://space.bilibili.com/355985675", // 点击作者名称后跳转的链接
  },
  social: [

    {
      icon: "simple-icons:gitee",
      name: "Gitee",
      link: "https://gitee.com/DingTongYa/tjqd",
    },
  ],
  footerInfo: {
    theme: {
      show: false, // 是否显示主题版权，建议显示
      name: "", // 自定义名称
      link: "", // 自定义链接
    },

  },
  articleUpdate: {
    enabled: true, // 是否启用文章最近更新栏
    limit: 3, // 文章最近更新栏显示数量
  },
  articleShare: {
    enabled: true, // 是否开启文章链接分享功能
    text: "分享此页面", // 分享按钮文本
    copiedText: "链接已复制", // 复制成功文本
    query: false, // 是否包含查询参数
    hash: false, // 是否包含哈希值
  },
  appreciation: {
    position: "doc-after", // 赞赏位置
    // 赞赏配置
    options: {
      icon: "weChatPay", // 赞赏图标，内置 weChatPay 和 alipay
      expandTitle: "打赏支持", // 展开标题，支持 HTML
      collapseTitle: "打赏支持", // 折叠标题，支持 HTML
      content: `<img src='/skm-wx.jpg'>`, // 赞赏内容，支持 HTML
      expand: true, // 是否默认展开，默认 false
    },
  },
  pageStyle: "segment-nav",
});

// VitePress 配置
export default defineConfig({
  title: '挺进高级前端',
  // 确保主题配置继承
  extends: teekConfig,
  // Algolia搜索配置
  algolia: {
    appId: 'YOUR_APP_ID',
    apiKey: 'YOUR_SEARCH_API_KEY',
    indexName: 'YOUR_INDEX_NAME'
  },

  siteTitle: '前进！前进！前进进！',
  logo: '/logo3.svg',
  markdown: {
      config(md) {
        // vitepressPluginLegend(md);
      },
    },
  // extends: teekConfig,
  // ...
});